<template>
  <div class="mirror-tab1">
    <div class="tableBox">
      <el-table
        v-loading="tableLoading"
        :data="tableData"
        height="85vh"
        style="width: 100%"
        class="tableTh28"
        border
        stripe
        :span-method="arraySpanMethod"
        ref="table"
      >
        <el-table-column fixed v-if="subtype == '0'" label="本地网" prop="areaName" min-width="120"></el-table-column>

        <el-table-column fixed v-if="subtype == '1'" label="分类" prop="dataType" min-width="40"></el-table-column>
        <el-table-column fixed v-if="subtype == '1'" label="地市" prop="localName" min-width="90"></el-table-column>
        <el-table-column fixed v-if="subtype == '1'" label="县(市)分公司/分局" prop="areaName" min-width="130"></el-table-column>
        <!-- <el-table-column label="收入完成">
          <el-table-column :label="it.label" :key="index" v-for="(it, index) in title1">
            <el-table-column
              class-name="right-money"
              v-for="(item, index) in it.it"
              min-width="120"
              :key="index"
              :label="item.label"
              :prop="item.id"
            ></el-table-column>
          </el-table-column>
        </el-table-column>-->
        <el-table-column label="收入完成">
          <el-table-column label="主营收入完成率">
            <el-table-column label="预算数" min-width="120" prop="mainBusinessBudget"></el-table-column>
            <el-table-column label="完成数" min-width="120" prop="mainBusinessAmount"></el-table-column>
            <el-table-column label="完成率" min-width="120" prop="mainBusinessRate"></el-table-column>
            <el-table-column label="月累计预算" min-width="120" prop="mainBusinessMonTotalBudget"></el-table-column>
            <el-table-column label="月累计预算完成率" min-width="120" prop="mainBusinessMonTotalRate"></el-table-column>
          </el-table-column>
          <el-table-column label="基本面收入完成率">
            <el-table-column label="预算数" min-width="120" prop="baseBudget"></el-table-column>
            <el-table-column label="完成数" min-width="120" prop="baseAmount"></el-table-column>
            <el-table-column label="完成率" min-width="120" prop="baseRate"></el-table-column>
            <el-table-column label="月累计预算" min-width="120" prop="baseMonTotalBudget"></el-table-column>
            <el-table-column label="月累计预算完成率" min-width="120" prop="baseMonTotalRate"></el-table-column>
          </el-table-column>
          <el-table-column label="号码级收入完成率">
            <el-table-column label="预算数" min-width="120" prop="numberBudget"></el-table-column>
            <el-table-column label="完成数" min-width="120" prop="numberAmount"></el-table-column>
            <el-table-column label="完成率" min-width="120" prop="numberRate"></el-table-column>
            <el-table-column label="月累计预算" min-width="120" prop="numberMonTotalBudget"></el-table-column>
            <el-table-column label="月累计预算完成率" min-width="120" prop="numberMonTotalRate"></el-table-column>
            <el-table-column label="缺口" min-width="120" prop="numberGap"></el-table-column>
          </el-table-column>
        </el-table-column>

        <el-table-column label="主量发展">
          <el-table-column label="移动净增完成率">
            <el-table-column label="预算数" min-width="120" prop="ydNetBudget"></el-table-column>
            <el-table-column label="完成数" min-width="120" prop="ydNetAmount"></el-table-column>
            <el-table-column label="完成率" min-width="120" prop="ydNetRate"></el-table-column>
          </el-table-column>
          <el-table-column label="宽带净增完成率">
            <el-table-column label="预算数" min-width="120" prop="kdNetBudget"></el-table-column>
            <el-table-column label="完成数" min-width="120" prop="kdNetAmount"></el-table-column>
            <el-table-column label="完成率" min-width="120" prop="kdNetRate"></el-table-column>
          </el-table-column>
          <el-table-column label="5G用户净增完成率">
            <el-table-column label="预算数" min-width="120" prop="user_5gNetBudget"></el-table-column>
            <el-table-column label="完成数" min-width="120" prop="user_5gNetAmount"></el-table-column>
            <el-table-column label="完成率" min-width="120" prop="user_5gNetRate"></el-table-column>
          </el-table-column>
        </el-table-column>

        <!-- <el-table-column label="主量发展">
          <el-table-column :label="it.label" :key="index" v-for="(it, index) in title2">
            <el-table-column
              class-name="right-money"
              v-for="(item, index) in it.it"
              min-width="120"
              :key="index"
              :label="item.label"
              :prop="item.id"
            ></el-table-column>
          </el-table-column>
        </el-table-column>-->

        <el-table-column label="发展方式">
          <el-table-column label="高值主卡完成情况">
            <el-table-column label="三季度日均完成" prop="gzkDailyAverageComplete"></el-table-column>
            <el-table-column label="日均目标" prop="gzkDailyAverageTarget"></el-table-column>
            <el-table-column label="完成率" prop="gzkCompleteRate"></el-table-column>
          </el-table-column>
          <el-table-column label="有线宽带用户融合率">
            <el-table-column :label="(year - 1) + '年12月'" prop="kdUserMixLastYear"></el-table-column>
            <el-table-column :label="year + '年' + month + '月'" prop="kdUserMixThisMonth"></el-table-column>
            <el-table-column label="年度变动" prop="kdUserMixYearChange"></el-table-column>
          </el-table-column>
        </el-table-column>

        <el-table-column label="客户经营">
          <el-table-column label="存存量收入保有率" prop="ccIncomeRate"></el-table-column>
          <el-table-column :label="month + '月份目标'" prop="ccIncomeThisMonthTarget"></el-table-column>
          <el-table-column label="差距" prop="ccIncomeGap"></el-table-column>
          <el-table-column label="存增量收入保有率" prop="czIncomeRate"></el-table-column>
          <el-table-column :label="month + '月份目标'" prop="czIncomeThisMonthTarget"></el-table-column>
          <el-table-column label="差距" prop="czIncomeGap"></el-table-column>
          <el-table-column label="移动用户月均离网率" prop="ydMonAvgLostRate"></el-table-column>
          <el-table-column label="宽带用户月均离网率" prop="kdMonAvgLostRate"></el-table-column>
        </el-table-column>

        <el-table-column label="用户质态">
          <el-table-column label="移动用户活跃率">
            <el-table-column :label="(year - 1) + '年12月'" prop="ydActRateLastY"></el-table-column>
            <el-table-column :label="year + '年' + month + '月'" prop="ydActRateThisMon"></el-table-column>
            <el-table-column label="年度变动" prop="ydActRateYearChange"></el-table-column>
          </el-table-column>
          <el-table-column label="宽带用户活跃率">
            <el-table-column :label="(year - 1) + '年12月'" prop="kdActRateLastY"></el-table-column>
            <el-table-column :label="year + '年' + month + '月'" prop="kdActRateThisMonth"></el-table-column>
            <el-table-column label="年度变动" prop="kdActRateYearChange"></el-table-column>
          </el-table-column>
          <el-table-column label="天翼高清活跃率">
            <el-table-column :label="(year - 1) + '年12月'" prop="tyActRateLastY"></el-table-column>
            <el-table-column :label="year + '年' + month + '月'" prop="tyActRateThisMonth"></el-table-column>
            <el-table-column label="年度变动" prop="tyActRateYearChange"></el-table-column>
          </el-table-column>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
import { mergeSpan } from "@/utils/mixin";
export default {
  name: "incomeMirror-tab1",
  props: ["rowData0", "rawTime"],
  data() {
    return {
      tableData: [],
      tableLoading: false,
      spanArr: null,
      year: "",
      month: "",
      time: {},
      title1: [],
      title2: [],
      title3: [],
      subtype: '0'
    };
  },
  watch: {
    // tableData(val, oldVal) {
    //   console.log(1, val);
    //   console.log(2, oldVal);
    // },
    //  sheetList(val, oldVal) {
    //   this.tableData = val.dataList;
    //   this.colunmName = val.areaNames;
    //   this.rowspan();
    //   this.tableLoading=false;
    //   setTimeout(() => {
    //     this.$refs.table.doLayout();
    //   }, 500);
    // }
  },
  methods: {
    //table合并行
    arraySpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex == 0 && this.subtype == '1') {
        return this.spanArr && this.spanArr[rowIndex][columnIndex];
      }
    },

    init() {
      let that = this,
        year = that.rawTime.year,
        month = that.rawTime.month,
        type = that.rawTime.type;

      that.year = +year;
      that.month = month;
      that.tableData = that.rowData0.data;
      that.subtype = type;

      if (type == '1' && that.rowData0 && that.rowData0.data.length) {
        that.spanArr = mergeSpan(that.rowData0.data, ["dataType"]);
      }
      
      that.$nextTick(() => {
        that.tableLoading = false;
        that.$refs.table.doLayout();
      });
    },
  },
};
</script>

<style lang="scss">
.mirror-tab1 {
  .cell {
    text-align: center;
  }
}
</style>